<template>
    <div class="">
        <el-dialog title="编辑留守老人" :visible.sync="dialog" width="40%" :before-close="dialogClose">
            <el-form ref="formData" :model="formData" label-width="100px">
				<el-form-item label="所属村级" prop="hamletid">
				    <el-select v-model="formData.hamletid" style="width: 100%;" placeholder="请选择所属村级">
				    	<el-option :label="item.title" :value="item.id" v-for="(item, index) in Hamlet"></el-option>
				    </el-select>
				</el-form-item>
				
				<el-row>
					<el-col :span="12">
						<el-form-item label="姓名" prop="name">
						    <el-input v-model="formData.name" placeholder="请输入姓名"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="出生日期" prop="date">
						    <el-date-picker
						    	style="width: 100%;"
						    	v-model="formData.date"
						    	type="date"
						    	format="yyyy-MM-dd"
						    	value-format="yyyy-MM-dd"
						    	placeholder="选择日期">
						    </el-date-picker>
						</el-form-item>
					</el-col>
				</el-row>

				<el-row>
					<el-col :span="12">
						<el-form-item label="身份证号" prop="idcard">
						    <el-input v-model="formData.idcard" placeholder="请输入身份证号"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="老人类别" prop="cate">
						    <el-input v-model="formData.cate" placeholder="请输入老人类别"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				
				<el-row>
					<el-col :span="12">
						<el-form-item label="自理能力" prop="capacity">
						    <el-input v-model="formData.capacity" placeholder="请输入自理能力"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="享受待遇" prop="treatment">
						    <el-input v-model="formData.treatment" placeholder="请输入享受待遇"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				
				<el-row>
					<el-col :span="12">
						<el-form-item label="配偶姓名" prop="spouse_name">
						    <el-input v-model="formData.spouse_name" placeholder="请输入配偶姓名"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="配偶身份证" prop="spouse_idcard">
						    <el-input v-model="formData.spouse_idcard" placeholder="请输入配偶身份证"></el-input>
						</el-form-item>
					</el-col>
					
				</el-row>
				
				<el-row>
					<el-col :span="12">
						<el-form-item label="配偶自理能力" prop="spouse_capacity">
							<el-input v-model="formData.spouse_capacity" placeholder="请输入配偶自理能力"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="可支配收入" prop="income_year">
						    <el-input v-model="formData.income_year" placeholder="请输入上年度可支配收入">
								<template slot="append">元</template>
							</el-input>
						</el-form-item>
					</el-col>
				</el-row>
				
				
				<el-row>
					<el-col :span="12">
						<el-form-item label="照料人姓名" prop="care_name">
						    <el-input v-model="formData.care_name" placeholder="请输入照料人姓名"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="照料人电话" prop="care_phone">
						    <el-input v-model="formData.care_phone" placeholder="请输入照料人电话"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="12">
						<el-form-item label="巡防人" prop="patrol_name">
						    <el-input v-model="formData.patrol_name" placeholder="请输入巡防人"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="巡防时间" prop="patrol_date">
						    <el-date-picker
						    	style="width: 100%;"
						    	v-model="formData.patrol_date"
						    	type="datetime"
						    	format="yyyy-MM-dd HH:mm:ss"
						    	value-format="yyyy-MM-dd HH:mm:ss"
						    	placeholder="选择日期">
						    </el-date-picker>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="12">
						<el-form-item label="巡防内容" prop="patrol_info">
						    <el-input v-model="formData.patrol_info" placeholder="请输入巡防内容"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="巡防情况" prop="patrol_situation">
						    <el-input v-model="formData.patrol_situation" placeholder="请输入巡防情况"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				
				<el-row>
					<el-col :span="12">
						<el-form-item label="子女人数" prop="childs">
						    <el-input v-model="formData.childs" placeholder="请输入子女人数">
								<template slot="append">人</template>
							</el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="收入来源" prop="income_income">
						    <el-input v-model="formData.income_income" placeholder="请输入收入来源"></el-input>
						</el-form-item>
					</el-col>
				</el-row>
				
				<el-row>
					<el-col :span="12">
						<el-form-item label="现居住地" prop="addr">
						    <el-input v-model="formData.addr" placeholder="请输入现居住地"></el-input>
						</el-form-item>
					</el-col>
					<el-col :span="12">
						<el-form-item label="异动事项" prop="patrol_change">
						    <el-input v-model="formData.patrol_change" placeholder="请输入异动事项"></el-input>
						</el-form-item>
					</el-col>
				</el-row>

            	<el-form-item>
            		<el-button @click="dialogClose">取 消</el-button>
            		<el-button type="primary" @click="formSubmit">确 定</el-button>
            	</el-form-item>
            </el-form>
        </el-dialog>
    </div>
</template>
<script>
export default {
	components: {
	},
	data() {
		return {
			dialog: false,
			Site: [],
			Hamlet: [],
			formData: {
				id: 0,
				hamletid: '', //所属村
				name: '', //姓名
				date: '', //出生日期
				idcard: '', //身份证号
				addr: '', //现居住地
				cate: '', //类别
				capacity: '', //自理能力
				treatment: '', //享受待遇
				spouse_name: '', //配偶姓名
				spouse_idcard: '', //配偶身份证
				spouse_capacity: '', //配偶自理能力
				patrol_name: '', //巡防人
				patrol_date: '', // 巡防时间
				patrol_info: '', //巡防内容
				patrol_situation: '', // 巡防情况
				patrol_change: '', //巡防异动事项
				care_name: '', //照料人姓名
				care_phone: '', //照料人电话
				childs: '', //子女人数
				income_income: '', //收入来源
				income_year: '', //上年度可支配收入
			},
		}
	},
	created() {
	},
	watch: {
		dialog () {
			if(!this.dialog) {
				this.clearFormData()
				this.$emit('getData')
			} else {
				this.getHamlet()
				this.getSite()
			}
		}
	},
	methods: {
		getHamlet () {
			this.$apiPost('Hamlet/getHamlet').then(res => {
				if(res.code == 1) {
					this.Hamlet = res.data
				}
			})
		},
		getSite () {
			this.$apiPost('Index/getSiteFile').then(res => {
				if(res.code == 1) {
					this.Site = res.data
				}
			})
		},
		dialogClose(){
			this.$emit('dialogToggle')
		},
		clearFormData () {
			for(let i in this.formData){
				if(i == 'id') {
					this.formData[i] = 0
				} else {
					this.formData[i] = ''
				}
			}
		},
		// 保存编辑
		formSubmit() {
			this.$apiPost('StayElder/editData', this.formData).then(res => {
				if(res.code == 1) {
					this.$message(res.msg)
					this.dialogClose()
				} else {
					this.$message(res.msg)
				}
			})
		},
	}
}
</script>
<style scoped>
	.mselect{
		width: 100%;
	}
	.mtdiv{
		margin-top: 10px;
		display: inline-block;
		width: 100%;
	}
	.mtdiv .mtdiv-v{
		float: left;
		width: 50%;
		margin-bottom: 5px;
		display: flex;
		align-items: center;
	}
	.mtdiv .mtdiv-v label{
		float: left;
		margin-right: 10px;
	}
	.mtdiv .el-input{
		float: left;
		width: 80%;
		margin: 5px 0;
	}
	.el-cascader {
		line-height: 32px !important;
	}
	.el-input__inner {
	    height: 32px !important;
	    line-height: 32px !important;
	}
	.el-input__icon {
		line-height: 32px !important;
	}
</style>
